<style scoped>
    .views-title[data-v-135e40b8] {
        margin-bottom: 0 !important;
    }

    .bgk {
        background-color: #EDF2F6;
        padding-top: 20px;
        margin-bottom: 20px;
        padding-left: 20px;

    }

    .guanli {
        width: 20%;
        padding: 0;
        border-radius: 0 2px 2px 0;

    }

    .border-bottom {
        border-bottom: 1px solid #B9B9B9;
    }

    .iconclass {
        display: inline-block;
        width: 58px;
        background: #fff;
        border: 1px dashed #757F98;
        border-radius: 4px;
        text-align: center;
        cursor: pointer;
        position: relative;
        overflow: hidden;
        transition: border-color .2s ease;
        height: 58px;
        line-height: 58px;
        vertical-align: middle;
    }

    .inline-block {
        display: inline-block;
    }

    .middle {
        vertical-align: middle;
    }

    .cropper-wrapper {
        margin-top: 10px;
        height: 400px;
    }

    .cropper-box {
        height: 300px;
    }

    .btn {
        display: inline-block;
        line-height: 1;
        white-space: nowrap;
        cursor: pointer;
        background: #fff;
        border: 1px solid #c0ccda;
        color: #1f2d3d;
        text-align: center;
        box-sizing: border-box;
        outline: none;
        margin: 20px 10px 0px 0px;
        padding: 9px 15px;
        font-size: 14px;
        border-radius: 4px;
        color: #fff;
        background-color: #50bfff;
        border-color: #50bfff;
        transition: all .2s ease;
        text-decoration: none;
        user-select: none;
    }
</style>
<template>

    <div>
        <product-title style=""></product-title>
        <div class="form-box">
            <Form ref="form" :model="form" :rules="formValidate">
                <Row>
                    <i-col>
                        <h3 class="search-h3 huang">
                            基本信息
                        </h3>
                    </i-col>
                </Row>
                <Row class="common-box-body border-bottom ">
                    <i-col :md="12" :lg="6">
                        <FormItem label="标题" prop="name">
                            <i-input v-model="form.name" placeholder="请输入标题"></i-input>
                        </FormItem>
                    </i-col>
                    <i-col :md="12" :lg="6">
                        <FormItem label="作者" prop="author">
                            <i-input v-model="form.author" placeholder="请输入作者"></i-input>
                        </FormItem>
                    </i-col>
                    <i-col :md="12" :lg="6">
                        <FormItem label="栏目分类">
                            <!-- <i-select v-model="cate"  @on-change="cateChange" label-in-value  style="width:60%;margin-right:3%;">
                                 <template v-for="(item,index) in cate_list">
                                    <template v-for="(item1,index1) in item.son" v-if="item.son!=undefined">
                                        <i-option :value="item1.id" :key="item1.id">{{item.cate_name}}-----{{item1.cate_name}}</i-option>
                                    </template>
                                    <i-option :value="item.id" :key="item.id" v-if="item.son==undefined">{{item.cate_name}}-----</i-option>
                                 </template>
                                </i-select> -->

                            <Cascader style="width:60%;margin-right:3%;display:inline-block;overflow: hidden;" :data="cateJson" v-model="form.cateArray"
                                @on-change="cate_change"></Cascader>
                            <Button type="primary" class="guanli" @click="fenModal" style="display: inline-block;vertical-align: top;">管理</Button>
                        </FormItem>
                    </i-col>
                    <i-col :md="12" :lg="6">
                        <FormItem label="状态" prop="status">
                            <i-select v-model="form.status" transfer>
                                <i-option value="1">取消发布</i-option>
                                <i-option value="2">发布</i-option>
                            </i-select>
                        </FormItem>
                    </i-col>
                </Row>
                <Row class="mt7">
                    <i-col>
                        <h3 class="search-h3 huang">
                            关键字
                        </h3>
                    </i-col>
                </Row>
                <Row class="bgk common-box-body">
                    <Col :md="24" :lg="6" class="col col1">
                    <FormItem label="添加关键字" prop="keyword">
                        <i-input placeholder="请输入标签" style="width:80%;border-radius:0px !important;" v-model="keyCont"></i-input><Button type="success" class="guanli" @click="addKeyWord">添加</Button>
                    </FormItem>
                    </Col>
                    <Col :md="24" :lg="18" class="col">
                    <Tag v-for="(item,index) in form.keyword" :key="item" :name="item" closable type="dot" color="blue" @on-close="removeKeyWord(index)">{{item}}</Tag>
                    </Col>
                </Row>
                <Row class="border-bottom">
                </Row>
                <div class="border-bottom " style="padding:10px 0">
                    <Row style="height:100px;">
                        <div class="">
                            <div class="huang inline-block mr40 " style="font-size:18px;">
                                封面
                            </div>
                            <div class="pointer inline-block mr20">
                                <input type="file" id="imgAdd" style="display:none;">
                                <span class="iconclass pointer" @click="imgFile">
                                    <Icon type="camera" size="20"></Icon>
                                    <img width="58" height="58" />
                                </span>
                            </div>
                            <div style="line-height:normal;color:#D0D0D0;" class="inline-block mr20 ">
                                注释大小
                                <br/> 600*365
                            </div>
                            <div class="inline-block middle">
                                <span class="middle">
                                    <img :src="form.pic" style="height:66px;width:160px;">
                                </span>
                            </div>
                        </div>

                    </Row>
                </div>
                <Row class="mt20">
                    <i-col>
                        <h3 class="search-h3 huang">
                            详细信息
                        </h3>
                    </i-col>
                </Row>
                <Row>
                    <i-col span="24">
                        <UE :defaultMsg="form.content" :config=config ref="content" id="content"></UE>
                    </i-col>
                </Row>
            </Form>
            <div id="footer" class="pt22" v-if="coutag">
                <Button type="primary" v-if="$isShow('classroom/create')" shape="circle" id="submit" @click="submit" style="border-radius: 30px !important;">
                    <Icon type="checkmark-circled"></Icon>
                    保存 / 提交
                </Button>
                <Button id="back" shape="circle" @click="cancel" style="border-radius: 30px !important;">返回</Button>
            </div>
            <div id="footer" class="pt22" v-else>
                <Button type="primary" v-if="$isShow('classroom/update')" shape="circle" id="submit" @click="submit" style="border-radius: 30px !important;">
                    <Icon type="checkmark-circled"></Icon>
                    保存 / 提交
                </Button>
                <Button id="back" shape="circle" @click="cancel" style="border-radius: 30px !important;">返回</Button>
            </div>
        </div>
        <Modal v-model="modal1" title="分类管理" width="900px" class="fenlei" :mask-closable="false" @on-cancel="getAllCate">
            <Row style="height:400px;">
                <i-col :md="14" :lg="14" class="pr15" style="padding:16px;height:100%;overflow:scroll;overflow-x:hidden;">
                    <div>
                        <template v-for="(item,index) in fenleiArray">
                            <div class="zhu">
                                <span class="" class="pointer" @click="true1(index)">
                                    <Icon type="chevron-up" class="ml15 mr10" v-if="xianshi==index"></Icon>
                                    <Icon type="chevron-down" class="ml15 mr10 pointer" v-else></Icon>
                                </span>
                                <input type="text" v-if="bianji==index" v-model="bianjiCont" class="outLine">
                                <span v-else class="" style="color:#4D7FE4;" :key="item.cate_name">{{item.cate_name}}</span>
                                <span class="fr caozuo create" @click="bianji1(index,item.id,0)" v-if="bianji==index" style="background-color:#18BF6D;">
                                    <Icon type="checkmark-round"></Icon>
                                </span>
                                <span class="fr caozuo create" @click="bianji1(index,item.id,0)" v-else>
                                    <Icon type="android-create"></Icon>
                                </span>
                                <span class="fr caozuo del" @click="delete1(index,item.id,0)">
                                    <Icon type="trash-a"></Icon>
                                </span>
                            </div>
                            <div class="fu" v-if="xianshi==index">
                                <template v-for="(item1,index1) in item.son">
                                    <div class="list">
                                        <Icon class="ml15"></Icon>
                                        ---------&nbsp;&nbsp;
                                        <!-- <input type="text"> -->
                                        <input type="text" v-if="bianjiTwo == index1" v-model="bianjiCont1">
                                        <span v-else>{{item1.cate_name}}</span>
                                        <span class="fr caozuo create" @click="bianji2(index,index1,item1.id,item.id)" v-if="bianjiTwo==index1" style="background-color:#18BF6D;">
                                            <Icon type="checkmark-round"></Icon>
                                        </span>
                                        <span class="fr caozuo create" @click="bianji2(index,index1,item1.id,item.id)" v-else>
                                            <Icon type="android-create"></Icon>
                                        </span>
                                        <span class="fr caozuo del" @click="delete1(index,item1.id,item.id)">
                                            <Icon type="trash-a"></Icon>
                                        </span>
                                    </div>
                                </template>
                            </div>
                        </template>

                    </div>
                </i-col>
                <i-col :md="10" :lg="10" style="padding:15px;background-color:#CEEAF7;height:100%;">
                    <h3 class="searchH3 mt16">添加分类</h3>
                    <Form ref="fenleiForm" :model="fenleiForm" label-position="left" :label-width="80" id="fenleiForm">
                        <i-col :md="24" :lg="24">
                            <FormItem label="上级分类" prop="cate_first" class="bian">
                                <i-select placeholder="请选择上级分类" v-model="fenleiForm.pid">
                                    <i-option value="0">根分类</i-option>
                                    <template v-for="(item,index) in cateFirst">
                                        <i-option :value="item.id" :key="item.cate_name">{{item.cate_name}}</i-option>
                                    </template>
                                </i-select>
                            </FormItem>
                        </i-col>
                        <i-col :md="24" :lg="24">
                            <FormItem label="分类名称" prop="cate_two" class="bian">
                                <Input type="text" placeholder="请输入分类名称" v-model="fenleiForm.cate_name">
                                </Input>
                            </FormItem>
                        </i-col>
                        <i-col :md="24" :lg="24" class="tCenter">
                            <i-button type="primary" shape="circle" @click="cate_create">
                                <Icon class="iconfont icon-dui" style="font-size:14px;"></Icon>&emsp; 新增分类
                            </i-button>
                        </i-col>
                    </Form>
                </i-col>
            </Row>
        </Modal>
        <Modal v-model="modal2" width="1200" ok-text="上传图片" :loading="loading" @on-ok="uploadHeadimg" :mask-closable="false">
            <Row class="cropper-wrapper">
                <Col span="11" class="cropper-box">
                <vueCropper ref="cropper" :img="headImg.img" :autoCrop="headImg.autoCrop" :autoCropWidth="headImg.autoCropWidth" :autoCropHeight="headImg.autoCropHeight"
                    :fixedBox="headImg.fixedBox" :canMoveBox="headImg.canMoveBox" @realTime="realTime"></vueCropper>
                <label class="btn" for="upload2">打开图片</label>
                <input type="file" id="upload2" style="position:absolute; clip:rect(0 0 0 0);" accept="image/png, image/jpeg, image/gif, image/jpg"
                    @change="uploadImg($event)">
                <!-- <button @click="finish2('base64')" class="btn">裁剪</button> -->
                </Col>
                <Col span="7" offset="1">
                <!-- <img :src="formItem.headImg.demoimg" /> -->
                <div class="show-preview" :style="{'width': previews.w + 'px', 'height': previews.h + 'px',  'overflow': 'hidden', 'margin': '5px'}">
                    <div :style="previews.div">
                        <img :src="headImg.img" :style="previews.img">
                    </div>
                </div>
                </Col>
            </Row>
        </Modal>
    </div>
</template>

<script>
    import productTitle from '../../components/productTitle.vue';
    import {
        create,
        get_detail,
        update
    } from '../../api/classroom';
    //    import { get_cate_first , get_cate_second} from '../../api/parter';
    import {
        saveCate,
        get_cate_list,
        get_cate_one,
        get_cate_two,
        cate_detail,
        delCate,
        update_cate,
        get_all_cate
    } from '../../api/class_cate'
    import {
        getStsTokenWrite,
        getStsTokenRead
    } from '../../api/common';


    import UE from '../UE/ue.vue';
    import '../../../static/UEdit/ueditor.config.js';
    import '../../../static/UEdit/ueditor.all.js';
    import '../../../static/UEdit/lang/zh-cn/zh-cn.js';
    import '../../../static/UEdit/ueditor.parse.js';

    import VueCropper from 'vue-cropper';

    export default {
        data() {
            return {
                cateJson: [],
                defaultMsg: '',
                config: {
                    initialFrameWidth: null,
                    initialFrameHeight: 350
                },
                fenleiArray: [],
                xianshi: -1,
                bianji: -1,
                bianjiTwo: -1,
                bianjiCont: '',
                bianjiCont1: '',
                fenleiForm: {
                    pid: '',
                    cate_name: '',
                },
                cateFirst: [],
                zhedie: '1',
                keyCont: '',
                modal1: false,
                form: {
                    title: '',
                    author: '',
                    name: '',
                    keyword: [],
                    cate_first: '',
                    cate_second: '',
                    cate: '',
                    status: '2',
                    pic: '',
                    id: '',
                    content: ''
                },
                formValidate: {
                    name: [{
                        required: true,
                        message: '标题不能为空'
                    }],
                    author: [{
                        required: true,
                        message: '作者不能为空'
                    }],
                    keyword: [{
                        required: true,
                        message: '关键字不能为空',
                    }]
                },
                cate_list: [],
                cate: '',
                canchange: false,
                img_name: '',
                img_src: '',
                detail: [],
                loading: true,
                previews: {},
                modal2: false,
                headImg: {
                    img: '',
                    autoCrop: true,
                    // 只有自动截图开启 宽度高度才生效
                    autoCropWidth: 493,
                    autoCropHeight: 300,
                    canMoveBox: false,
                    // 开启宽度和高度比例
                    fixedBox: true,
                    demoimg: '',
                },
                coutag:true
            }
        },
        created(){
            if(this.$route.params.id){
                this.coutag = false
                new Promise((rev,rej)=>{
                    this.get_cate_list();
                    this.get_cate_first()
                    this.cate_first();
                    rev();
                }).then(() => {
                    this.get_detail();
                })
            }else{
                this.coutag = true
            this.get_cate_list();
            this.get_cate_first()
            this.cate_first();
            }
        },
        components: {
            productTitle,
            UE,
            VueCropper
        },
        mounted() {
            this.getAllCate()
        },
        watch: {

        },
        updated() {},
        methods: {
            cate_change(value, selectedData) {
                console.log(value)
                console.log(selectedData)
                if (value.length > 0) {
                    this.form.cate_first = value[0]
                    if (value[1]) {
                        this.form.cate_second = value[1]
                    } else {
                        this.form.cate_second = ''
                    }
                } else {
                    this.form.cate_first = ''
                    this.form.cate_second = ''

                }


            },
            getAllCate() {

                new Promise((resolve, reject) => {
                    get_all_cate().then((res) => {
                        if (res.data.err == 0) {
                            console.log(res.data.data)
                            this.cateJson = res.data.data
                        } else {
                            this.$Message.error(res.data.info);
                        }
                    }).catch(error => {
                        reject(error);
                    });
                });
            },
            getUEContent() {
                this.formItem.content = this.$refs.ue.getUEContent();
            },
            //            setContent(){
            //                this.$refs.ue.getUEContent('1523456789');
            //            },
            keyword_del(index) {
                this.form.keyword.splice(index, 1);
            },
            keyword_add() {
                this.form.keyword.push(this.keyCont);
                this.keyCont = "";
            },
            get_detail() {
                this.form.id = this.$route.params.id;
                let params = {
                    id: this.$route.params.id
                }
                this.canchange = true;
                new Promise((rev, rej) => {
                    get_detail(params).then(res => {
                        if (res.data.err == 0) {
                            this.form = res.data.data;
                            // if(res.data.data.cate_second&&res.data.data.cate_second!='kong'){
                            //     this.cate = res.data.data.cate_second;
                            // }else if(res.data.data.cate_first){
                            //     this.cate = res.data.data.cate_first;
                            // }else{
                            //     this.cate = '';
                            // }
                            this.form.cateArray = [res.data.data.cate_first, res.data.data.cate_second]
                            res.data.data.keyword[0] ? this.form.keyword = res.data.data.keyword : this
                                .form.keyword = [];
                            this.form.status = res.data.data.status?res.data.data.status.toString():'1';
                            this.$refs['content'].setUEContent(res.data.data.content);
                        } else {
                            this.$Message.error('详情获取' + res.data.info);
                        }
                        rev();
                    }).catch(error => {
                        rej(error);
                    });
                });
            },
            get_cate_first() {
                new Promise((resolve, reject) => {
                    get_cate_one().then((res) => {
                        if (res.data.err == 0) {

                            this.fenleiArray = res.data.data;
                            // alert(res.data.data.list[1].son);
                        } else {
                            this.$Message.error('产品分类' + res.data.info);
                        }
                    }).catch(error => {
                        reject(error);
                    });
                });
            },
            get_cate_second(id, index) {
                console.log(id, index)
                let params = {
                    pid: id
                }
                new Promise((resolve, reject) => {
                    get_cate_two(params).then((res) => {
                        if (res.data.err == 0) {
                            if (res.data.data.length > 0) {
                                this.fenleiArray[index].son = res.data.data;
                                this.$set(this.fenleiArray, index, this.fenleiArray[index])
                            } else {
                                delete this.fenleiArray[index].son
                                this.$set(this.fenleiArray, index, this.fenleiArray[index])
                            }
                        } else {
                            this.$Message.error('产品分类' + res.data.info);
                        }
                    }).catch(error => {
                        reject(error);
                    });
                });
            },
            get_cate_list() {
                new Promise((resolve, reject) => {
                    get_cate_list().then((res) => {
                        if (res.data.err == 0) {
                            this.cate_list = res.data.data.list;
                            //this.fenleiArray = res.data.data.list;
                            // alert(res.data.data.list[1].son);
                        } else {
                            this.$Message.error('产品分类' + res.data.info);
                        }
                    }).catch(error => {
                        reject(error);
                    });
                });
            },
            // get_cate_first(){
            //     new Promise((resolve,reject)=>{
            //         get_cate_one().then((res)=>{
            //             res.data.err==0?this.cate_one_list = res.data.data:this.$Message.error(res.data.info);
            //             resolve();
            //         }).catch(error=>{
            //             reject(error);
            //         });
            //     });

            // },
            // get_cate_second(){
            //     let params = {
            //         id:this.formItem.cate_first
            //     }
            //     new Promise((rev,rej)=>{
            //         get_cate_two(params).then(res=>{
            //             if(res.data.err==0){
            //                 this.cate_two_list=res.data.data;
            //                 this.formItem.cate_second = res.data.data[0].id;
            //             }else if(res.data.err==1400){
            //                 this.formItem.cate_second='kong';
            //             } else{
            //                 this.$Message.error(res.data.info)
            //             }
            //             rev();
            //         }).catch(error=>{
            //             rej(error);
            //         });
            //     });
            // },
            submit() {
                this.form.content = this.$refs['content'].getUEContent();
                if (this.$route.params.id) {
                    this.$refs['form'].validate((valid) => {
                        if (valid) {
                            new Promise((rev, rej) => {
                                update(this.form).then(res => {
                                    res.data.err == 0 ? this.$router.push({
                                        name: 'classroom'
                                    }) : this.$Message.error(res.data.info);
                                    rev();
                                }).catch(error => {
                                    rej(error);
                                })
                            })
                        } else {
                            this.$Message.error('请完善信息!');
                        }
                    })

                } else {
                    this.$refs['form'].validate((valid) => {
                        if (valid) {
                            new Promise((rev, rej) => {
                                create(this.form).then(res => {
                                    res.data.err == 0 ? this.$router.push({
                                        name: 'classroom'
                                    }) : this.$Message.error(res.data.info);
                                    rev();
                                }).catch(error => {
                                    rej(error);
                                })
                            })
                        } else {
                            this.$Message.error('请完善信息!');
                        }
                    })

                }
            },
            back() {
                this.$router.push({
                    name: 'classroom'
                });
            },
            addKeyWord() {
                if(this.keyCont){
                    this.form.keyword.push(this.keyCont);
                this.keyCont = "";
                }else{
                    this.$Message.error('关键字不能为空');
                }
                
            },
            removeKeyWord(index) {
                this.form.keyword.splice(index, 1);
            },
            toBlob(urlData, fileType) {
                var bytes = window.atob(urlData),
                    n = bytes.length,
                    u8arr = new Uint8Array(n);
                while (n--) {
                    u8arr[n] = bytes.charCodeAt(n);
                }
                return new Blob([u8arr], {
                    type: fileType
                });
            },
            uploadHeadimg() {
                this.$refs.cropper.getCropData((data) => {
                    getStsTokenWrite().then((res) => {
                        if (res.data.err == 0) {
                            let _this = this;
                            var sts = res.data.data.Credentials;
                            var client = new OSS.Wrapper({
                                region: 'oss-cn-hangzhou',
                                accessKeyId: sts.AccessKeyId,
                                accessKeySecret: sts.AccessKeySecret,
                                stsToken: sts.SecurityToken,
                                bucket: 'kuaibao-imgs',
                                secure: true, 
                            });
                            var base64 = data.split(',')[1];
                            var fileType = data.split(';')[0].split(':')[1];

                            // base64转blob
                            var blob = this.toBlob(base64, fileType);
                            // blob转arrayBuffer
                            var reader = new FileReader();
                            reader.readAsArrayBuffer(blob);

                            // var files = this.files;
                            const files = document.getElementById('upload2').files[0];
                            reader.onload = function (event) {
                                var buffer = new OSS.Buffer(event.target.result);
                                //这里用 multipartUpload  上传会报错，所以更改为 put
                                client.put(files.name, buffer).then((results) => {
                                    console.log(results);
                                    if (results.url) {
                                        _this.form.pic = results.url;
                                    } else {
                                        this.$Message.error('上传出错');
                                    }
                                })
                            }
                        }
                    })
                })
                this.modal2 = false;

            },
            realTime(data) {
                this.previews = data
            },
            uploadImg(e) {
                var file = e.target.files[0];
                if (!/\.(gif|jpg|jpeg|png|bmp|GIF|JPG|PNG)$/.test(e.target.value)) {
                    alert('图片类型必须是.gif,jpeg,jpg,png,bmp中的一种')
                    return false
                }
                var reader = new FileReader()
                reader.onload = (e) => {
                    this.headImg.img = e.target.result
                }
                reader.readAsDataURL(file);
            },
            cate_detail(val) {
                let params = {
                    id: val
                }
                new Promise((rev, rej) => {
                    cate_detail(params).then(res => {
                        if (res.data.err == 0) {
                            this.form.cate_first = res.data.data.pid;
                            this.form.cate_second = res.data.data.id;
                        } else {
                            this.$Message.error('分类' + res.data.info);
                        }
                        rev();
                    }).catch(error => {
                        rej(error);
                    });
                });
            },
            cateChange(val) {
                if (!this.$route.params.id) {
                    if (val.label.split('-----')[1]) {
                        this.cate_detail(val.value);
                    } else {
                        this.form.cate_first = val.value;
                        this.form.cate_second = "";
                    }
                } else {
                    if (val.label.split('-----')[1]) {
                        this.cate_detail(val.value);
                    } else {
                        this.form.cate_first = val.value;
                        this.form.cate_second = "";
                    }
                }

            },
            imgFile() {
                this.modal2 = true;
            },
            fenModal() {
                this.modal1 = true;
            },
            true1(val) {
                if (this.xianshi == val) {
                    this.xianshi = -1;
                    this.bianji = -1;
                    this.bianjiTwo = -1;
                    this.bianjiCont1 = "";
                    this.bianjiCont = "";

                } else {
                    if (!this.fenleiArray[val].son) {
                        this.get_cate_second(this.fenleiArray[val].id, val)
                    }
                    this.xianshi = val;
                }
            },
            delete1(index, id, pid) {
                console.log(index, 'del')
                let params = {
                    id: id,
                    pid: pid
                }
                new Promise((resolve, rejecct) => {
                    delCate(params).then(res => {
                        if (res.data.err == 0) {
                            if (pid) {
                                this.get_cate_second(pid, index)
                            } else {
                                this.fenleiArray.splice(index, 1)
                            }
                            //this.cateList();
                            this.cate_first();
                            //this.get_cate_first();
                            this.$Message.success('操作成功！');
                        } else {
                            this.$Message.error(res.data.info);
                        }
                        resolve();
                    }).catch(error => {
                        rejecct(error);
                    });
                });
            },
            bianji1(val, id, pid) {
                if (this.bianji == val) {
                    this.bianji = -1;
                    this.cate_update(id, this.bianjiCont, pid);
                    this.cate_first();
                    this.get_cate_first();

                    // let _this = this;
                    // setTimeout(function(){
                    //         _this.cateList();   
                    //         _this.bianjiCont = "";
                    //     _this.$Message.success('操作成功！');
                    // },1000)

                    // this.$set('fenleiArray',this.fenleiArray);
                } else {
                    this.bianji = val;
                    this.bianjiCont = this.fenleiArray[val].cate_name;
                    // console.log(this.ceshi[val].zhu.name)
                }
            },
            bianji2(val, val1, id, pid) {

                if (this.bianjiTwo == val1) {
                    this.bianjiTwo = -1;
                    this.cate_update(id, this.bianjiCont1, pid).then(() => {
                        this.get_cate_second(pid, val)
                    });

                    console.log(123)
                    // let _this = this;
                    // setTimeout(function(){
                    //         _this.cateList();   
                    //         _this.bianjiCont1 = "";
                    //         _this.$Message.success('操作成功！');
                    // },1000)
                } else {
                    this.bianjiCont1 = this.fenleiArray[val].son[val1].cate_name;
                    this.bianjiTwo = val1;
                }
            },
            //获取分类
            cateList() {
                new Promise((resolve, rejecct) => {
                    get_cate_list().then(res => {
                        if (res.data.err == 0) {
                            //this.fenleiArray = res.data.data.list;
                            this.cate_list = res.data.data.list;
                        } else {
                            this.$Message.error(res.data.info);
                        }
                        resolve();
                    }).catch(error => {
                        rejecct(error);
                    });
                });
            },
            //一级分类
            cate_first() {
                new Promise((resolve, rejecct) => {
                    get_cate_one().then(res => {
                        if (res.data.err == 0) {
                            this.cateFirst = res.data.data;
                        } else {
                            this.$Message.error(res.data.info);
                        }
                        resolve();
                    }).catch(error => {
                        rejecct(error);
                    });
                });
            },
            //新增分类
            cate_create() {
                var tag = 0
                if (this.fenleiForm.pid) {
                    for (var i = 0; i < this.fenleiArray.length; i++) {
                        if (this.fenleiArray[i].id == this.fenleiForm.pid) {
                            tag = i
                        }
                    }
                }
                new Promise((resolve, rejecct) => {
                    saveCate(this.fenleiForm).then(res => {
                        if (res.data.err == 0) {
                            this.$Message.success('操作成功');
                            if (this.fenleiForm.pid == 0) {
                                this.cate_first();
                                this.get_cate_first();
                                this.xianshi = -1;
                                this.bianji = -1;
                                this.bianjiTwo = -1;
                                this.bianjiCont1 = "";
                                this.bianjiCont = "";
                            }
                            if (this.fenleiForm.pid) {
                                this.get_cate_second(this.fenleiForm.pid, tag);
                            }
                            this.fenleiForm.pid = "";
                            this.fenleiForm.cate_name = "";
                        } else {
                            if(res.data.err == 1201){
                                this.$Message.error('请完善信息！');
                            }else{
                                this.$Message.error(res.data.info);
                            }
                        }
                        resolve();
                    }).catch(error => {
                        rejecct(error);
                    });
                });
            },
            //修改分类
            cate_update(id, name, pid) {
                let params = {
                    id: id,
                    cate_name: name,
                    pid: pid
                }
                return new Promise((resolve, rejecct) => {
                    update_cate(params).then(res => {
                        if (res.data.err == 0) {
                            let _this = this;
                            _this.cateList();
                            _this.bianjiCont1 = "";
                            _this.bianjiCont = "";
                            _this.cate_first();
                            _this.get_cate_first();
                            
                            _this.$Message.success('操作成功！');
                        } else {
                            this.$Message.error(res.data.info);
                        }
                        resolve();
                    }).catch(error => {
                        rejecct(error);
                    });
                });
            },
            fenleichange(val) {
                let params = {
                    cate_id: val
                }
                new Promise((resolve, rejecct) => {
                    _cate_info(params).then(res => {
                        if (res.data.err == 0) {
                            this.proform.cate_one = res.data.data[0].pid;
                            this.proform.cate_two = res.data.data[0].id;
                        } else {
                            this.$Message.error(res.data.info);
                        }
                        resolve();
                    }).catch(error => {
                        rejecct(error);
                    });
                });
            },
            cancel() {
                this.$router.push({
                    name: 'classroom'
                })
            }
        },
    }
</script>